<template>
  <div style="zoom: 1; min-width:1200px; padding: 0 10px 10px; margin-top: 10px; " :style="{height:'calc(100vh - 90px)', overflowY:'auto'}">
    <Loading :loading="loading" :absolute="compState.absolute" :theme="compState.theme" :background="compState.background" :tip="compState.tip" />
    <div class="orderInfo">
      <!--一、集团账户---------->
      <div class="listtab1" id="con_menu_1">
        <form id="bucForm" action="" method="post">
          <div class="theadSticky" id="publicAccountsReal">
            <span class="float-left h-30px leading-30px w-50 font-bold text-lg" v-show="publicAccountsReal.optionList">
              <label>集团账户</label>
            </span>
            <span class="float-right h-30px leading-30px search">
              <span>对账日期: </span>
              <a-date-picker v-model:value="queryParam.jzsjBegin" valueFormat="YYYY-MM-DD" style="width: 140px; margin-right: 0px;" />
              <span class="w-30px text-align-center" style="display: inline-block; text-align: center;">至</span>
              <a-date-picker v-model:value="queryParam.jzsjEnd" valueFormat="YYYY-MM-DD" style="width: 140px; margin-right: 10px;" />
              <a-button size="small" type="default" color="success" @click="init()" class="mr-2 px-3" :loading="loading" style="width: 70px; border-radius: 20px;">查询</a-button>
              <a-button size="small" type="default" color="warning" @click="handleBankBalanceSet()" class="mr-2 px-3" style="width: 70px; border-radius: 20px;" v-auth="'bankBalancePage:set'">设置</a-button>
              <a-button size="small" type="default" color="error" @click="handleClear()" style="width: 70px; border-radius: 20px;" v-auth="'bankBalancePage:clr'">清洗</a-button>
            </span>
          </div>
          <table class="orderTable" id="buctable" v-show="publicAccountsReal.optionList">
            <tbody>
            <tr class="listBg">
              <th width="30" class="bg-red-50"></th>
              <th width="200" class="text-left bg-red-50">银行账户</th>
              <th width="110" class="text-right">历史银行余额</th>
              <th width="110" class="text-right">昨日银行收入</th>
              <th width="110" class="text-right">昨日银行支出</th>
              <th width="110" class="text-right">昨日银行差额</th>
              <th width="110" class="text-right">昨日银行余额</th>
              <th width="110" class="text-right">昨日系统收入</th>
              <th width="110" class="text-right">昨日系统支出</th>
              <th width="110" class="text-right">昨日系统差额</th>
              <th width="110" class="text-right">历史对账差异</th>
              <th width="110" class="text-right">历史系统己审</th>
              <th width="110" class="text-right">历史系统未审</th>
            </tr>
            </tbody>
            <tbody v-for="(list, index) in publicAccountsReal.optionList" :key="index">
            <tr :class="(index%2==0) ? 'listBg' : 'cor'" @dblclick="showPublicAccountsRealClick(list, '集团账户')">
              <td width="30" class="bg-red-50">{{index + 1}}</td>
              <td width="200" class="text-left bg-red-50">{{list.djm || '0.00'}}</td>
              <td width="110" class="text-right text-rose-600">{{list.t2lslrje || '0.00'}}</td>
              <td width="110" class="text-right text-green-600">{{list.t1lssrje || '0.00'}}</td>
              <td width="110" class="text-right text-purple-600">{{list.t1lszcje || '0.00'}}</td>
              <td width="110" class="text-right text-blue-600">{{list.t1lslrje || '0.00'}}</td>
              <td width="110" class="text-right text-rose-600">{{list.t0lslrje || '0.00'}}</td>
              <td width="110" class="text-right text-green-600">{{list.t1xtsrje || '0.00'}}</td>
              <td width="110" class="text-right text-purple-600">{{list.t1xtzcje || '0.00'}}</td>
              <td width="110" class="text-right text-blue-600">{{list.t1xtlrje || '0.00'}}</td>
              <td width="110" class="text-right text-rose-600 cursor-pointer underline" :class="{'bg-rose-50': list.lrce !== '0.00'}">{{list.lrce || '0.00'}}</td>
              <td width="110" class="text-right text-green-600">{{list.t1xtyh || '0.00'}}</td>
              <td width="110" class="text-right text-purple-600 cursor-pointer underline">{{list.t1xtwh || '0.00'}}</td>
            </tr><!-- @click="showTRclick(isshow)"   -->
            </tbody>
            <tfoot>
            <tr>
              <td width="30" class="tips">&nbsp;</td>
              <td width="200" class="text-left font-900">合计</td>
              <td width="110" class="text-right font-900 text-rose-600">{{publicAccountsReal.footer?.sumt2lslrje || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-green-600">{{publicAccountsReal.footer?.sumt1lssrje || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-purple-600">{{publicAccountsReal.footer?.sumt1lszcje || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-blue-600">{{publicAccountsReal.footer?.sumt1lslrje || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-rose-600">{{publicAccountsReal.footer?.sumt0lslrje || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-green-600">{{publicAccountsReal.footer?.sumt1xtsrje || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-purple-600">{{publicAccountsReal.footer?.sumt1xtzcje || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-blue-600">{{publicAccountsReal.footer?.sumt1xtlrje || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-rose-600">{{publicAccountsReal.footer?.sumlrce || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-green-600">{{publicAccountsReal.footer?.sumt1xtyh || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-purple-600">{{publicAccountsReal.footer?.sumt1xtwh || '0.00'}}</td>
            </tr>
            </tfoot>
          </table>
        </form>
      </div>

      <!--二、国内分账---------->
      <div class="listtab1" id="con_menu_2" v-show="internalAccounts.optionList">
        <div class="theadSticky" id="internalAccounts">
          <span class="float-left h-30px leading-30px w-250 font-bold text-lg">
            <label>国内分账</label>
          </span>
          <span class="float-right h-30px leading-30px search" style="display: none;">
            <span>对账日期: </span>
            <a-date-picker v-model:value="queryParam.jzsjBegin" valueFormat="YYYY-MM-DD" style="width: 140px; margin-right: 0px;" />
            <span class="w-30px text-align-center" style="display: inline-block; text-align: center;">至</span>
            <a-date-picker v-model:value="queryParam.jzsjEnd" valueFormat="YYYY-MM-DD" style="width: 140px; margin-right: 10px;" />
            <a-button size="small" type="default" color="success" @click="init()" class="mr-2 px-3" :loading="loading" style="width: 70px; border-radius: 20px;">查询</a-button>
            <a-button size="small" type="default" color="warning" @click="handleBankBalanceSet()" style="width: 70px; border-radius: 20px;">设置</a-button>
          </span>
        </div>
        <table class="orderTable" id="buctable">
          <tbody>
          <tr class="listBg">
            <th width="30"></th>
            <th width="200" class="text-left">银行账户</th>
            <th width="110" class="text-right">历史系统余额</th>
            <th width="110" class="text-right">昨日系统收入</th>
            <th width="110" class="text-right">昨日系统支出</th>
            <th width="110" class="text-right">昨日系统差额</th>
            <th width="110" class="text-right">昨日系统余额</th>
            <th width="110" class="text-right">昨日订单收入</th>
            <th width="110" class="text-right">昨日订单支出</th>
            <th width="110" class="text-right">昨日订单差额</th>
            <th width="110" class="text-right">历史对账差异</th>
            <th width="110" class="text-right">历史系统己审</th>
            <th width="110" class="text-right">历史系统未审</th>
          </tr>
          </tbody>
          <tbody v-for="(list, index) in internalAccounts.optionList" :key="index">
          <tr :class="(index%2==0) ? 'listBg' : 'cor'" @dblclick="showPublicAccountsClick(list, '国内分账')">
            <td width="30" class="bg-green-50">{{index + 1}}</td>
            <td width="200" class="text-left bg-green-50">{{list.djm || '0.00'}}</td>
            <td width="110" class="text-right text-rose-600">{{list.t2lslrje || '0.00'}}</td>
            <td width="110" class="text-right text-green-600">{{list.t1lssrje || '0.00'}}</td>
            <td width="110" class="text-right text-purple-600">{{list.t1lszcje || '0.00'}}</td>
            <td width="110" class="text-right text-blue-600">{{list.t1lslrje || '0.00'}}</td>
            <td width="110" class="text-right text-rose-600">{{list.t0lslrje || '0.00'}}</td>
            <td width="110" class="text-right text-green-600">{{list.t1xtsrje || '0.00'}}</td>
            <td width="110" class="text-right text-purple-600">{{list.t1xtzcje || '0.00'}}</td>
            <td width="110" class="text-right text-blue-600">{{list.t1xtlrje || '0.00'}}</td>
            <td width="110" class="text-right text-rose-600 cursor-pointer underline" :class="{'bg-red-50': list.lrce !== '0.00'}">{{list.lrce || '0.00'}}</td>
            <td width="110" class="text-right text-green-600">{{list.t1xtyh || '0.00'}}</td>
            <td width="110" class="text-right text-purple-600 cursor-pointer underline">{{list.t1xtwh || '0.00'}}</td>
            <!--td class="text-right text-blue-600 cursor-pointer underline" @dblclick="showPublicAccountsClick(list.bank_id, list.djm, '1')">{{list.t0zbwh || '0%'}}</td-->
          </tr><!-- @click="showTRclick(isshow)"   -->
          </tbody>
          <tfoot>
          <tr>
            <td width="30" class="tips">&nbsp;</td>
            <td width="200" class="text-left font-900">合计</td>
            <td width="110" class="text-right font-900 text-rose-600">{{internalAccounts.footer?.sumt2lslrje || '0.00'}}</td>
            <td width="110" class="text-right font-900 text-green-600">{{internalAccounts.footer?.sumt1lssrje || '0.00'}}</td>
            <td width="110" class="text-right font-900 text-purple-600">{{internalAccounts.footer?.sumt1lszcje || '0.00'}}</td>
            <td width="110" class="text-right font-900 text-blue-600">{{internalAccounts.footer?.sumt1lslrje || '0.00'}}</td>
            <td width="110" class="text-right font-900 text-rose-600">{{internalAccounts.footer?.sumt0lslrje || '0.00'}}</td>
            <td width="110" class="text-right font-900 text-green-600">{{internalAccounts.footer?.sumt1xtsrje || '0.00'}}</td>
            <td width="110" class="text-right font-900 text-purple-600">{{internalAccounts.footer?.sumt1xtzcje || '0.00'}}</td>
            <td width="110" class="text-right font-900 text-blue-600">{{internalAccounts.footer?.sumt1xtlrje || '0.00'}}</td>
            <td width="110" class="text-right font-900 text-rose-600">{{internalAccounts.footer?.sumlrce || '0.00'}}</td>
            <td width="110" class="text-right font-900 text-green-600">{{internalAccounts.footer?.sumt1xtyh || '0.00'}}</td>
            <td width="110" class="text-right font-900 text-purple-600">{{internalAccounts.footer?.sumt1xtwh || '0.00'}}</td>
            <!--td width="110" class="text-right text-purple-600"></td-->
          </tr>
          </tfoot>
        </table>
      </div>

      <!--三、国际账户---------->
      <div class="listtab1" id="con_menu_3" v-show="internatAccounts.optionList">
        <form id="bucForm" action="" method="post">
          <div class="theadSticky" id="internatAccounts">
            <span class="float-left h-30px leading-30px w-200 font-bold text-lg">
              <label>国际账户</label>
            </span>
            <span class="float-right h-30px leading-30px search" style="display: none;">
              <span>对账日期: </span>
              <a-date-picker v-model:value="queryParam.jzsjBegin" valueFormat="YYYY-MM-DD" style="width: 140px; margin-right: 0px;" />
              <span class="w-30px text-align-center" style="display: inline-block; text-align: center;">至</span>
              <a-date-picker v-model:value="queryParam.jzsjEnd" valueFormat="YYYY-MM-DD" style="width: 140px; margin-right: 10px;" />
              <a-button size="small" type="default" color="success" @click="init()" class="mr-2 px-3" :loading="loading" style="width: 70px; border-radius: 20px;">查询</a-button>
              <a-button size="small" type="default" color="warning" @click="handleBankBalanceSet()" style="width: 70px; border-radius: 20px;">设置</a-button>
            </span>
          </div>
          <table class="orderTable" id="buctable">
            <tbody>
            <tr class="listBg">
              <th width="30"></th>
              <th width="200" class="text-left">银行账户</th>
              <th width="110" class="text-right">历史系统余额</th>
              <th width="110" class="text-right">昨日系统收入</th>
              <th width="110" class="text-right">昨日系统支出</th>
              <th width="110" class="text-right">昨日系统差额</th>
              <th width="110" class="text-right">昨日系统余额</th>
              <th width="110" class="text-right">昨日订单收入</th>
              <th width="110" class="text-right">昨日订单支出</th>
              <th width="110" class="text-right">昨日订单差额</th>
              <th width="110" class="text-right">历史对账差异</th>
              <th width="110" class="text-right">历史系统己审</th>
              <th width="110" class="text-right">历史系统未审</th>
            </tr>
            </tbody> <!--:class="{ 'selected': selectedRows.includes(index) }"-->
            <tbody v-for="(list, index) in internatAccounts.optionList" :key="index">
            <tr :class="(index%2==0) ? 'listBg' : 'cor'" @dblclick="showPublicAccountsClick(list, '国际账户')"
              @mousedown="startSelection(index)"
              @mouseup="endSelection()"
              @mouseleave="handleMouseLeave(index)"
              @mousemove="handleMouseMove(index)"
            >
              <td width="30" class="bg-blue-50">{{index + 1}}</td>
              <td width="200" class="text-left bg-blue-50">{{list.djm || '0.00'}}</td>
              <td width="110" class="text-right text-rose-600">{{list.t2lslrje || '0.00'}}</td>
              <td width="110" class="text-right text-green-600">{{list.t1lssrje || '0.00'}}</td>
              <td width="110" class="text-right text-purple-600">{{list.t1lszcje || '0.00'}}</td>
              <td width="110" class="text-right text-blue-600">{{list.t1lslrje || '0.00'}}</td>
              <td width="110" class="text-right text-rose-600">{{list.t0lslrje || '0.00'}}</td>
              <td width="110" class="text-right text-green-600">{{list.t1xtsrje || '0.00'}}</td>
              <td width="110" class="text-right text-purple-600">{{list.t1xtzcje || '0.00'}}</td>
              <td width="110" class="text-right text-blue-600">{{list.t1xtlrje || '0.00'}}</td>
              <td width="110" class="text-right text-rose-600 cursor-pointer underline" :class="{'bg-red-50': list.lrce !== '0.00'}">{{list.lrce || '0.00'}}</td>
              <td width="110" class="text-right text-green-600">{{list.t1xtyh || '0.00'}}</td>
              <td width="110" class="text-right text-purple-600 cursor-pointer underline">{{list.t1xtwh || '0.00'}}</td>
              <!--td class="text-right text-blue-600 cursor-pointer underline" @dblclick="showPublicAccountsClick(list.bank_id, list.djm, '1')">{{list.t0zbwh || '0%'}}</td-->
            </tr><!-- @click="showTRclick(isshow)"   -->
            </tbody>
            <tfoot>
            <tr>
              <td class="tips">&nbsp;</td>
              <td width="200" class="text-left font-900">合计</td>
              <td width="110" class="text-right font-900 text-rose-600">{{internatAccounts.footer?.sumt2lslrje || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-green-600">{{internatAccounts.footer?.sumt1lssrje || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-purple-600">{{internatAccounts.footer?.sumt1lszcje || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-blue-600">{{internatAccounts.footer?.sumt1lslrje || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-rose-600">{{internatAccounts.footer?.sumt0lslrje || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-green-600">{{internatAccounts.footer?.sumt1xtsrje || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-purple-600">{{internatAccounts.footer?.sumt1xtzcje || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-blue-600">{{internatAccounts.footer?.sumt1xtlrje || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-rose-600">{{internatAccounts.footer?.sumlrce || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-green-600">{{internatAccounts.footer?.sumt1xtyh || '0.00'}}</td>
              <td width="110" class="text-right font-900 text-purple-600">{{internatAccounts.footer?.sumt1xtwh || '0.00'}}</td>
              <!--td width="110" class="text-right text-purple-600"></td-->
            </tr>
            </tfoot>
          </table>
        </form>
      </div>

      <!--四、国内账户--------->
      <div class="listtab1" id="con_menu_4" v-for="(optionList, index) in internalAccountsAll">
        <form id="bucForm" action="" method="post">
          <div class="theadSticky" v-show="optionList.name" :id="'internalAccountsAll' + index">
            <span class="float-left h-30px leading-30px w-100 font-bold text-lg">
              <label>{{ optionList.name }}账户</label>
            </span>
            <span class="float-right h-30px leading-30px search" style="display: none;">
              <span>对账日期: </span>
              <a-date-picker v-model:value="queryParam.jzsjBegin" valueFormat="YYYY-MM-DD" style="width: 140px; margin-right: 0px;" />
              <span class="w-30px text-align-center" style="display: inline-block; text-align: center;">至</span>
              <a-date-picker v-model:value="queryParam.jzsjEnd" valueFormat="YYYY-MM-DD" style="width: 140px; margin-right: 10px;" />
              <a-button size="small" type="default" color="success" @click="init()" class="mr-2 px-3" :loading="loading" style="width: 70px; border-radius: 20px;">查询</a-button>
              <a-button size="small" type="default" color="warning" @click="handleBankBalanceSet()" style="width: 70px; border-radius: 20px;">设置</a-button>
            </span>
          </div>
          <table class="orderTable" id="buctable" v-show="optionList.list">
            <tbody>
            <tr class="listBg">
              <th width="30"></th>
              <th width="200" class="text-left">银行账户</th>
              <th width="110" class="text-right">历史系统余额</th>
              <th width="110" class="text-right">昨日系统收入</th>
              <th width="110" class="text-right">昨日系统支出</th>
              <th width="110" class="text-right">昨日系统差额</th>
              <th width="110" class="text-right">昨日系统余额</th>
              <th width="110" class="text-right">昨日订单收入</th>
              <th width="110" class="text-right">昨日订单支出</th>
              <th width="110" class="text-right">昨日订单差额</th>
              <th width="110" class="text-right">历史对账差异</th>
              <th width="110" class="text-right">历史系统己审</th>
              <th width="110" class="text-right">历史系统未审</th>
            </tr>
            </tbody>
            <tbody v-for="(list, index) in optionList.list" :key="index">
            <tr :class="(index%2==0) ? 'listBg' : 'cor'" @dblclick="showDepartAccountsClick(list, optionList.name + '账户')">
              <td width="30" class="bg-purple-50">{{index + 1}}</td>
              <td width="200" class="text-left bg-purple-50">{{list.djm}}</td>
              <td width="110" class="text-right text-rose-600">{{list.t2lslrje}}</td>
              <td width="110" class="text-right text-green-600">{{list.t1lssrje}}</td>
              <td width="110" class="text-right text-purple-600">{{list.t1lszcje}}</td>
              <td width="110" class="text-right text-blue-600">{{list.t1lslrje}}</td>
              <td width="110" class="text-right text-rose-600">{{list.t0lslrje}}</td>
              <td width="110" class="text-right text-green-600">{{list.t1xtsrje}}</td>
              <td width="110" class="text-right text-purple-600">{{list.t1xtzcje}}</td>
              <td width="110" class="text-right text-blue-600">{{list.t1xtlrje}}</td>
              <td width="110" class="text-right text-rose-600 cursor-pointer underline" :class="{'bg-red-50': list.lrce !== '0.00'}">{{list.lrce}}</td>
              <td width="110" class="text-right text-green-600">{{list.t1xtyh}}</td>
              <td width="110" class="text-right text-purple-600 cursor-pointer underline">{{list.t1xtwh}}</td>
            </tr><!-- @click="showTRclick(isshow)"   -->
            </tbody>
            <tfoot>
            <tr>
              <td class="tips">&nbsp;</td>
              <td width="200" class="text-left font-900 ">合计</td>
              <td width="110" class="text-right font-900 text-rose-600">{{optionList.footer?.sumt2lslrje}}</td>
              <td width="110" class="text-right font-900 text-green-600">{{optionList.footer?.sumt1lssrje}}</td>
              <td width="110" class="text-right font-900 text-purple-600">{{optionList.footer?.sumt1lszcje}}</td>
              <td width="110" class="text-right font-900 text-blue-600">{{optionList.footer?.sumt1lslrje}}</td>
              <td width="110" class="text-right font-900 text-rose-600">{{optionList.footer?.sumt0lslrje}}</td>
              <td width="110" class="text-right font-900 text-green-600">{{optionList.footer?.sumt1xtsrje}}</td>
              <td width="110" class="text-right font-900 text-purple-600">{{optionList.footer?.sumt1xtzcje}}</td>
              <td width="110" class="text-right font-900 text-blue-600">{{optionList.footer?.sumt1xtlrje}}</td>
              <td width="110" class="text-right font-900 text-rose-600">{{optionList.footer?.sumlrce}}</td>
              <td width="110" class="text-right font-900 text-green-600">{{optionList.footer?.sumt1xtyh}}</td>
              <td width="110" class="text-right font-900 text-purple-600">{{optionList.footer?.sumt1xtwh}}</td>
              <!--td width="110" class="text-right text-purple-600"></td-->
            </tr>
            </tfoot>
          </table>
        </form>
      </div>

      <!--五、国际账户--------->
      <div class="listtab1" id="con_menu_5" v-for="(optionList, index) in internatAccountsAll">
        <form id="bucForm" action="" method="post">
          <div class="theadSticky" v-show="optionList.name" :id="'internatAccountsAll' + index">
            <span class="float-left h-30px leading-30px w-100 font-bold text-lg">
              <label>{{ optionList.name }}账户</label>
            </span>
            <span class="float-right h-30px leading-30px search" style="display: none;">
              <span>对账日期: </span>
              <a-date-picker v-model:value="queryParam.jzsjBegin" valueFormat="YYYY-MM-DD" style="width: 140px; margin-right: 0px;" />
              <span class="w-30px text-align-center" style="display: inline-block; text-align: center;">至</span>
              <a-date-picker v-model:value="queryParam.jzsjEnd" valueFormat="YYYY-MM-DD" style="width: 140px; margin-right: 10px;" />
              <a-button size="small" type="default" color="success" @click="init()" class="mr-2 px-3" :loading="loading" style="width: 70px; border-radius: 20px;">查询</a-button>
              <a-button size="small" type="default" color="warning" @click="handleBankBalanceSet()" style="width: 70px; border-radius: 20px;">设置</a-button>
            </span>
          </div>
          <table class="orderTable" id="buctable" v-show="optionList.list">
            <tbody>
            <tr class="listBg">
              <th width="30"></th>
              <th width="200" class="text-left">银行账户</th>
              <th width="110" class="text-right">历史系统余额</th>
              <th width="110" class="text-right">昨日系统收入</th>
              <th width="110" class="text-right">昨日系统支出</th>
              <th width="110" class="text-right">昨日系统差额</th>
              <th width="110" class="text-right">昨日系统余额</th>
              <th width="110" class="text-right">昨日订单收入</th>
              <th width="110" class="text-right">昨日订单支出</th>
              <th width="110" class="text-right">昨日订单差额</th>
              <th width="110" class="text-right">历史对账差异</th>
              <th width="110" class="text-right">历史系统己审</th>
              <th width="110" class="text-right">历史系统未审</th>
            </tr>
            </tbody>
            <tbody v-for="(list, index) in optionList.list" :key="index">
            <tr :class="(index%2==0) ? 'listBg' : 'cor'" @dblclick="showDepartAccountsClick(list, optionList.name + '账户')">
              <td width="30" class="bg-lime-50">{{index + 1}}</td>
              <td width="200" class="text-left bg-lime-50">{{list.djm}}</td>
              <td width="110" class="text-right text-rose-600">{{list.t2lslrje}}</td>
              <td width="110" class="text-right text-green-600">{{list.t1lssrje}}</td>
              <td width="110" class="text-right text-purple-600">{{list.t1lszcje}}</td>
              <td width="110" class="text-right text-blue-600">{{list.t1lslrje}}</td>
              <td width="110" class="text-right text-rose-600">{{list.t0lslrje}}</td>
              <td width="110" class="text-right text-green-600">{{list.t1xtsrje}}</td>
              <td width="110" class="text-right text-purple-600">{{list.t1xtzcje}}</td>
              <td width="110" class="text-right text-blue-600">{{list.t1xtlrje}}</td>
              <td width="110" class="text-right text-rose-600 cursor-pointer underline" :class="{'bg-red-50': list.lrce !== '0.00'}">{{list.lrce}}</td>
              <td width="110" class="text-right text-green-600">{{list.t1xtyh}}</td>
              <td width="110" class="text-right text-purple-600 cursor-pointer underline">{{list.t1xtwh}}</td>
            </tr><!-- @click="showTRclick(isshow)"   -->
            </tbody>
            <tfoot>
            <tr>
              <td class="tips">&nbsp;</td>
              <td width="200" class="text-left font-900 ">合计</td>
              <td width="110" class="text-right font-900 text-rose-600">{{optionList.footer?.sumt2lslrje}}</td>
              <td width="110" class="text-right font-900 text-green-600">{{optionList.footer?.sumt1lssrje}}</td>
              <td width="110" class="text-right font-900 text-purple-600">{{optionList.footer?.sumt1lszcje}}</td>
              <td width="110" class="text-right font-900 text-blue-600">{{optionList.footer?.sumt1lslrje}}</td>
              <td width="110" class="text-right font-900 text-rose-600">{{optionList.footer?.sumt0lslrje}}</td>
              <td width="110" class="text-right font-900 text-green-600">{{optionList.footer?.sumt1xtsrje}}</td>
              <td width="110" class="text-right font-900 text-purple-600">{{optionList.footer?.sumt1xtzcje}}</td>
              <td width="110" class="text-right font-900 text-blue-600">{{optionList.footer?.sumt1xtlrje}}</td>
              <td width="110" class="text-right font-900 text-rose-600">{{optionList.footer?.sumlrce}}</td>
              <td width="110" class="text-right font-900 text-green-600">{{optionList.footer?.sumt1xtyh}}</td>
              <td width="110" class="text-right font-900 text-purple-600">{{optionList.footer?.sumt1xtwh}}</td>
              <!--td width="110" class="text-right text-purple-600"></td-->
            </tr>
            </tfoot>
          </table>
        </form>
      </div>
    </div>
  </div>

  <BankBalanceModal @register="registerBankBalanceModal"></BankBalanceModal>
  <BankBalanceReal @register="registerBankBalanceReal"></BankBalanceReal>
  <BankBalanceDepart @register="registerBankBalanceDepart"></BankBalanceDepart>
  <BankBalanceSet @register="registerBankBalanceSet"></BankBalanceSet>

</template>

<script lang="ts" setup name="bank-BankBalancePage">
import "/@/views/full/business/order.css";
import { ref, reactive, onMounted, nextTick } from 'vue';
import { useModal } from '/@/components/Modal';
import { findBalanceReport, createBalanceDataReport, bankBalanceClear } from '/@/views/full/bank/types/bank.api';
import { filterObj } from '/@/utils/common/compUtils';
import { useMessage } from '/@/hooks/web/useMessage';
import { Loading } from '/@/components/Loading';

import dayjs from 'dayjs';
import BankBalanceModal from "./modules/BankBalanceModal.vue";
import BankBalanceReal from "./modules/BankBalanceReal.vue";
import BankBalanceDepart from "./modules/BankBalanceDepart.vue";
import BankBalanceSet from "./modules/BankBalanceSet.vue";


const { createMessage: $message } = useMessage();

const isSelecting  = ref(false);
const startIndex   = ref(0);
const selectedRows = ref<number[]>([]);

const compState = reactive({
  absolute: false,
  theme: 'light',
  background: 'rgba(111,111,111,.3)',
  tip: '加载中...',
});

let loading = ref(false);
let publicAccountsReal = reactive<any>({});
let publicAccountsAll  = reactive<any>({});
let publicAccountsInternal = reactive<any>({});
let internalAccounts = reactive<any>({});
let internatAccounts = reactive<any>({});
let internalAccountsAll = reactive<any>({});
let internatAccountsAll = reactive<any>({});

//初始化 -------------------------------------------------------------
//定义查询表单，查询条件
const queryParam = reactive<any>({
  jzsjBegin: dayjs().subtract(1, 'days').format('YYYY-MM-DD'), //'2023-01-30',
  jzsjEnd: dayjs().subtract(0, 'days').format('YYYY-MM-DD'), //'2023-01-30',
  bankId: null,
  orderId: '',
});

//数据加载------------------
async function init() {
  doclear()
  await orderTable(queryParam).then(() => {
    // refreshOrderButton()
    // doclear()
  });
}

//订单界面所有信息
async function orderTable(params) {
  loading.value = true;
  await findBalanceReport(filterObj(params)).then((res) => {
    try {
      let result = res.result;
      Object.assign(publicAccountsReal, result.publicAccountsReal);
      Object.assign(publicAccountsAll, result.publicAccountsAll);
      Object.assign(publicAccountsInternal, result.publicAccountsInternal);
      Object.assign(internalAccounts, result.internalAccounts);
      Object.assign(internalAccountsAll, result.internalAccountsAll);
      Object.assign(internatAccounts, result.internatAccounts);
      Object.assign(internatAccountsAll, result.internatAccountsAll);
    } catch (e) {
      alert(e);
      return false;
    }
  }).finally(() => {
    loading.value = false;
  });
}

//日对账
const [registerBankBalanceModal, {openModal: openBankBalanceModal}] = useModal();

//--------------------------
function showPublicAccountsClick(list, title) {
  let record = {
    djm: list.djm,
    t0lslrje: list.t0lslrje,
    bankId: list.bank_id,
    beginDate: queryParam.jzsjBegin,
    endDate: queryParam.jzsjEnd,
    title: title,
  }
  openBankBalanceModal(true, { record, isUpdate: false });
}

//-刷新-------------------------
function handleCreateBalanceData() {
  let record = {
    // djm: djm,
    // bankId: bankId,
    beginDate: queryParam.jzsjBegin,
    endDate: queryParam.jzsjEnd
  }
  createBalanceDataReport(record).then(res => {
    try {
      if (res.success != true) {
        $message.warning(res.message);
      } else {
        $message.success("操作成功");
        init()
      }
    } catch (e) {
      return false;
    }
    // refreshOrderButton()
  });
}

// 真实数据--------------------------------------
const [registerBankBalanceReal, {openModal: openBankBalanceReal}] = useModal();

function showPublicAccountsRealClick(list, title) {
  let record = {
    djm: list.djm,
    t0lslrje: list.t0lslrje,
    bankId: list.bank_id,
    beginDate: queryParam.jzsjBegin,
    endDate: queryParam.jzsjEnd,
    title: title
  }

  openBankBalanceReal(true, { record, isUpdate: false });
}


//--部门对账---------------------------
const [registerBankBalanceDepart, {openModal: openBankBalanceDepart}] = useModal();

function showDepartAccountsClick(list, title) {
  let record = {
    djm: list.djm,
    t0lslrje: list.t0lslrje,
    bankId: list.bank_id,
    beginDate: queryParam.jzsjBegin,
    endDate: queryParam.jzsjEnd,
    departId: list.departId,
    departName: list.departName,
    title: title
  }

  openBankBalanceDepart(true, { record, isUpdate: false });
}

//--设置---------------------------
const [registerBankBalanceSet, {openModal: openBankBalanceSet}] = useModal();

function handleBankBalanceSet() {
  openBankBalanceSet();
}


//---------------------------------------------------------------------
const startSelection = (index) => {
  isSelecting.value = true;
  startIndex.value = index;
  selectedRows.value = [index];
};

const endSelection = () => {
  isSelecting.value = false;
  // 处理选中的数据
  // console.log('Selected rows:', selectedRows.value);
};

const handleMouseMove = (index) => {
  if (isSelecting.value) {
    const start = Math.min(startIndex.value, index);
    const end = Math.max(startIndex.value, index);
    selectedRows.value = Array.from(
      { length: end - start + 1 },
      (_, i) => start + i
    );
  }
};

const handleMouseLeave = (index) => {
  if (isSelecting.value) {
    handleMouseMove(index);
  }
};

function doclear() {
  queryParam.bankId    = '';
  queryParam.orderId   = '';
  publicAccountsReal   = {};
  publicAccountsAll    = {};
  publicAccountsInternal = {};
  internalAccounts       = {};
  internalAccountsAll    = {};
  internatAccounts       = {};
  internatAccountsAll    = {};
}

//六、清洗数据------------------------
/**
 * 清洗数据
 */
function handleClear() {
  bankBalanceClear()
}

onMounted(() => {
  init()
  // .then(() => {
  //   // 监听所有theadSticky元素的吸顶状态
  //   const observer = new IntersectionObserver((entries) => {
  //     // 先隐藏所有.search元素
  //     const allSearchElements = document.querySelectorAll('.search');
  //     allSearchElements.forEach(el => {
  //       el.style.display = 'none';
  //     });
      
  //     // 找到当前最顶部的可见theadSticky元素
  //     let topMostVisibleElement = null;
  //     let minTop = Infinity;
      
  //     entries.forEach(entry => {
  //       if (entry.isIntersecting) {
  //         const rect = entry.target.getBoundingClientRect();
  //         if (rect.top >= 0 && rect.top < minTop) {
  //           minTop = rect.top;
  //           topMostVisibleElement = entry.target;
  //         }
  //       }
  //     });
      
  //     // 显示最顶部元素的.search
  //     if (topMostVisibleElement) {
  //       const searchElement = topMostVisibleElement.querySelector('.search');
  //       if (searchElement) {
  //         searchElement.style.display = 'block';
  //       }
  //     }
  //   }, {
  //     threshold: [0.1, 0.5, 1],
  //     rootMargin: '-1px 0px 0px 0px'
  //   });

  //   const theadStickyElements = document.querySelectorAll('.theadSticky');
  //   // 为所有theadSticky元素添加观察
  //   theadStickyElements.forEach(element => {
  //     observer.observe(element);
  //   });
  // });
})

</script>
<style lang="less" scoped>
// newCode：新代码改为
body,html {
  width: 100%;
  min-height: 100vh;
}
.orderTable .ant-form-item {
  margin-bottom: 0px;
}

.jeecg-modal-wrapper {
  overflow: hidden;
}

.theadSticky {
  position: -webkit-sticky;
  position: sticky;
  top: 0px;
  z-index: 10;

  padding:6px 4px;
  background:#fff;
  border: 1px solid #d6dde7;
  height: 42px;
  line-height: 30px;
  margin-bottom: -1px;
  font-size: 16px;
  min-width: 1440px;
}

// newCode：新代码改为 -----------------------------------
.orderTable {
  table-layout: fixed;
  width: 100%;
}

.orderTable th, .orderTable td {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.orderTable .listBg {
  background-color: #ffffff;
}

.orderTable .cor {
  background-color: #f9fafb;
}

.orderTable tr:hover td {
  background-color: #fffff0;
}

// 金额正负颜色优化
.text-red-500 {
  color: #ff4d4f !important;
}

.text-emerald-500 {
  color: #52c41a !important;
}

.text-blue-500 {
  color: #1890ff !important;
}

.text-purple-500 {
  color: #722ed1 !important;
}

.underline {
  text-decoration: underline;
  text-decoration-thickness: 1px; /* 下划线粗细 */
  text-decoration-style: dotted; /* 下划线样式：solid/dashed/dotted/double/wavy */
  text-underline-offset: 3px; /* 下划线与文本的距离 */
}

.selected {
  background-color: #e6f7ff;
}

/* 重点列样式 */
.text-right.text-red-500 {
  font-weight: 500;
  background-color: #ffeeee;
}

</style>
